Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ignore brightness of pixels outside the viewport #119

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

DanActions
Copy link

Fixes #57 by ignoring pixels outside of the viewport when calculating brightness.

I think the issue is in calculatePixelBrightness(). The following lines get the dimensions of the target image and fetch those pixels from the canvas:

var dims = target.getBoundingClientRect();
...
data = context.getImageData(dims.left, dims.top, dims.width, dims.height).data;

The function then loops through data pixel-by-pixel to calculate the average brightness.

The problem is that if part of the bounding rectangle is outside the viewport, getImageData will return rgba(0,0,0,0) for those pixels. The formula that calculatePixelBrightness() uses to calculate average brightness doesn't consider the alpha value, causing it to see these pixels as black, thus skewing the calculated brightness to be much darker than the visible image.

The pull request attempts to fix this by trimming off the parts of the bounding rectangle that are outside the viewport before calling getImageData.

@DanActions DanActions force-pushed the fix-onscroll-viewport-check branch from d403521 to 6338e82 Compare February 23, 2022 21:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Checking Text on Background onscroll - Viewport Problem
1 participant